  import $ from 'jquery'
  /**
   * 获取css的样式值
   * @param {object}obj
   * @param attr
   * @returns {*}
   */
  function getCSSAttrValue(obj, attr) {
    if (obj.currentStyle) { // IE 和 opera
      return obj.currentStyle[attr];
    } else {
      return window.getComputedStyle(obj, null)[attr];
    }
  }

  /**
   * 缓动动画
   * @param obj
   * @param json
   * @param fn
   */
  function buffer(obj, json, fn) {
    // 1.1 清除定时器
    clearInterval(obj.timerCHartSlide);
    // 1.2 设置定时器
    let begin = 0,
      target = 0,
      speed = 0;
    
    obj.timerCHartSlide = setInterval(function () {
      // 1.3.0 旗帜
      let flag = true;
      for (let k in json) {
        // 1.3 获取初始值
        if ("opacity" === k) { // 透明度
          begin = Math.round(parseFloat(getCSSAttrValue(obj, k)) * 100) || 100;
          target = parseInt(json[k] * 100);
        } else if ("scrollTop" === k) {
          begin = Math.ceil(obj.scrollTop);
          target = parseInt(json[k]);
        } else { // 其他情况
          begin = parseInt(getCSSAttrValue(obj, k)) || 0;
          target = parseInt(json[k]);
        }
        // 1.4 求出步长
        speed = (target - begin) * 0.2;

        // 1.5 判断是否向上取整
        speed = (target > begin) ? Math.ceil(speed) : Math.floor(speed);

        // 1.6 动起来
        if ("opacity" === k) { // 透明度
          // w3c的浏览器
          obj.style.opacity = (begin + speed) / 100;
          // ie 浏览器
          obj.style.filter = 'alpha(opacity:' + (begin + speed) + ')';
        } else if ("scrollTop" === k) {
          obj.scrollTop = begin + speed;
        } else {
          obj.style[k] = begin + speed + "px";
        }

        // 1.5 判断
        if (begin !== target) {
          flag = false;
        }
      }

      // 1.3 清除定时器
      if (flag) {
        clearInterval(obj.timerCHartSlide);

        // 判断有没有回调函数
        if (fn) {
          fn();
        }
      }
    }, 20);
  }
  //2 3折线图
  let timerCHartSlide = null;
  
  export function sliderChart(Dom,echartsDom,secDom) {
  
    //当前轮播图div的index
    let iNow=0;
    let slider = document.getElementsByClassName(Dom)[0];
    let slider_main_div = document.getElementsByClassName(echartsDom)[0].children;//获取两个chart
    //获取元素的width，方便设置left值
    let scroll_w = slider.offsetWidth;
    //两个echarts位置重置
    slider_main_div[0].style.left = "0px";
    slider_main_div[1].style.left = scroll_w + "px";
    function autoPlay() {
      // console.log("timerCHartSlide"+timerCHartSlide)
      $(secDom).css("visibility","visible")
      /*
       1.当前可视区域的图片快速左移;
       2.下一张图片快速出现在可视区域的右边
       3.让这张图片做动画进入
       */
      buffer(slider_main_div[iNow], {
        "left": -scroll_w
      });
      iNow++;
      // 判断
      if (iNow >= slider_main_div.length) {
        iNow = 0;
      }
      slider_main_div[iNow].style.left = scroll_w + 'px';
      buffer(slider_main_div[iNow], {
        "left": 0
      });
    }
    clearInterval(timerCHartSlide)
    timerCHartSlide = setInterval(autoPlay, 6000)
    // console.log("轮播定时器："+timerCHartSlide)
    //设置和清除定时器
    slider.onmouseover = function () {
      clearInterval(timerCHartSlide);
    };

    slider.onmouseout = function () {
      timerCHartSlide = setInterval(autoPlay, 6000);
    }

  }